import React from 'react';
import Classcard from './Classcard'
import PropTypes from 'prop-types';
import styles from './Classlist.css';
import { connect } from 'dva';

const infoDetail = function(dispatch, id){
  console.log(id);
  dispatch({type:'pagedata/openClassDetail',payload:id});
}
const Classlist = ({dispatch,title, content, bgpic,price, quote, id}) => {
  let titledom = typeof title === 'undefined' ? <div></div>:<div className = {styles.title}>{title}</div>
  let pricedom = typeof price === 'undefined' ? <div></div>:<div className = {styles.price}>￥{price}</div>
  let contentdom = typeof content === 'undefined' ? <div></div>:<div className = {styles.content}>{content}</div>
  return (
    <div
      className = {styles.listcontent}
      onClick = {()=> infoDetail(dispatch, id)}
    >
        <div className = {styles.listhead}>
        <Classcard
          ishead={0}
          bgpic={bgpic}
          content = {quote}
        />
        </div>
        <div className = {styles.listbody}>
            {titledom}
            {contentdom}
            {pricedom}
        </div>
    </div>
  );
};

Classlist.propTypes = {
    title: PropTypes.string,
    content: PropTypes.string.isRequired,
    price: PropTypes.number,
    quote: PropTypes.string
};

export default connect()(Classlist);
